<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
        <title>scaffoldStyle prototype</title>
        <script src=http://google.com/jsapi>
        </script>
        <script>
            google.load("jquery", "1.3.2");
            google.load("jqueryui", "1.5.3");
        </script>
        <script src=http://scaffoldstyle.googlecode.com/svn/trunk/code/jquery.scaffoldStyle.js>
        </script>
        <script>
            $(function(){
                 $('body *').declareScaffold();
                $('hide').hide();
            });
        </script>
        <link rel="stylesheet" type="text/css" href="css/style.css" media="all">
    </head>
    <body>
        <div id="testing_theme_gen">
            <div id="theme_gen_step1">Theme name<input type="text" />
            <input type="checkbox" name="header" id="cms_region-1" checked="checked">header
            <input type="checkbox" name="" id="cms_region-2">left
            <input type="checkbox" name="" id="cms_region-3">right
            <input type="checkbox" name="" checked="checked" id="cms_region-4">center
            <input type="checkbox" name="" id="cms_region-5" checked="checked">footer
            <a class="t" href="#">generate files</a>
            <a href="#" class="s">scaffold</a>
            </div>
            
            div#theme_gen_step2
            <script type="text/javascript">
                $(document).ready(function(){
                    $('a.t').click(function(){
                        var theVal = $('input').attr('value');
                        var styleVal =$('.warped_tab');
                        
                        // generate both files on click
                        $('div.loader').load('generate.info.php?themeName=' + theVal);
                        $('div.loader2').load('generate.style.php?scaffoldStyle=' + styleVal);
                        $('div.loader3').load('generate.tpl.php?themeName=' + theVal);
                    });
                    $('.s').click(function() {
                      console.log($('.warped_tab').text());
                    });

                });

            </script>
            <div class="loader">
            </div>
            <div class="loader2"></div><div class="loader3"></div>
        </div>
        <hide>
            h2.site_title+ul.main_nav>li.item-$*7+div.showcase>h1.page_heading+h3.page_sub_heading+button.find_more+div.content_block-$*3>h4.section_title+p*2 <h2 class="site_title">scaffold style</h2>
        </hide>
        <div class="page_wrap">
            <h2 class="site_logo">scaffoldStyle</h2>
            <ul class="main_nav">
                <li class="item-1">
                    <a href="/">how to use</a>
                </li>
                <li class="item-2">
                    <a href="/">documentation</a>
                </li>
                <li class="item-3">
                    <a href="/">download</a>
                </li>
                <li class="item-4">
                    <a href="/">wiki</a>
                </li>
                <li class="item-5">
                    <a href="/">forum</a>
                </li>
                <div class="showcase">
                    <h1 class="page_heading">Scaffold in style</h1>
                    <h3 class="page_sub_heading">rapid development with dynamic scaffold generation</h3>
                    <button class="find_more">
                        download
                    </button>
                </div>
                <div class="datblock content_block-1">
                    <h4 class="section_title">Rapid Coding</h4>
                    <p>
                        Duis pellentesque volutpat placerat. Nulla facilisi. Nam faucibus dolor lectus, sed molestie 
                    </p>
                    <p>
                        dolor? Quisque pretium, dui non semper congue, odio dolor tincidunt nibh, vitae varius dui 
                    </p>
                </div>
                <div class="datblock content_block-2">
                    <h4 class="section_title">et ipsum egestas porta. Suspendi</h4>
                    <p>
                        urna id libero. Pellentesque ullamcorper leo ac erat feugiat ac consectetur odio gravida. 
                    </p>
                    <p>
                        Donec odio massa, bibendum tincidunt mattis sit amet, semper quis orci. Fusce iaculis nisl 
                    </p>
                </div>
                <div class="datblock content_block-3">
                    <h4 class="section_title">sse potenti. Nulla sit amet nisl ultrice</h4>
                    <p>
                        s purus feugiat convallis! Maecenas lib
                    </p>
                    <p>
                        s purus feugiat convallis! Maecenas lib
                    </p>
                </div>
                <div class="footer">
                    <p>
                        Copyright (c) 2009 BY Software Inc
                    </p>
                </div>
            </ul>
        </div>
        <h1>create form to make theme packages</h1>
    </body>
</html>
